<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8"/>
    <title>jsx语法</title>
    <script src="./js/react.development.js"></script>
    <script src="./js/react-dom.development.js"></script>
    <script src="./js/babel.js"></script>
    <style>
        .style {
            padding: 50px;
            background: orange;
            color: cadetblue;
        }
    </style>
</head>
<body>

<div id="app"></div>

<script type="text/babel">
    const id = 'id'
    const data = 'Hello, world!'
    ReactDOM.render(
        <div>
            <h1 id={id} className="style">
                <span style={{color: 'white', fontSize: '48px'}}>
                     {data}
                </span>
            </h1>
            <p>小米求</p>
        </div>,
        document.getElementById('app')
    );
</script>

</body>
</html>
